<template>
    <div class="app-container">
        <vue-ueditor-wrap id="newsContent" ref="test" v-model="content" :config="config" @ready="ready"/>
        <!--        <div class="editor-custom-btn-container">-->
        <!--            <editorImage color="#1890ff" class="editor-upload-btn" @successCBK="imageSuccessCBK"/>-->
        <!--        </div>-->
    </div>
</template>
<script>
import VueUeditorWrap from 'vue-ueditor-wrap'
import editorImage from './components/EditorImage'

export default {
    name: '',
    components: {VueUeditorWrap, editorImage},
    props: {
        value: {
            type: String,
            default: ''
        }
    },
    mounted() {
        this.content = this.value;
    },
    data() {
        return {
            content: '',
            // 富文本编辑器配置
            config: {
                initialFrameWidth: '100%',
                initialFrameHeight: '100%',
                UEDITOR_HOME_URL: '/lib/UEditor/'
            },
            editorInstance: null
        }
    },
    watch: {
        content(value) {
            this.$emit('input', value)
        }
    },
    methods: {
        ready(editorInstance) {
            this.editorInstance = editorInstance
        },
        imageSuccessCBK(arr) {
            arr.forEach(v => {
                this.editorInstance.execCommand('insertimage', {
                    src: this.CMBASE.baseFileContext + v.url
                })
            })
        }
    }
}
</script>
<style lang="scss" scoped>
</style>
